const _FireManInfoModel = $.parseJSON( localStorage.getItem('msg') );
const _UserRoleRelationModel=$.parseJSON( localStorage.getItem('item') );
new Vue({
    el: '#ele',
    data: {
        form:{},
        InfoCar:[],
        Pumper:[{//
            Commander_num:'',
            Commander_name:'',
            Commander_type:'',
            Fire_brigade:'',
            Fire_brigade_name:'',
            Fire_number:'',
            Ifused:null
        }],
        arrOut:[],              //  已经选择过的排除
        time:'',
        time2:'',
        map:'',
        flag:'',
        Vehicle_time:'',
        Fire_brigade_number:'',
        Fire_brigade_name:'',
        FireNumer:'',//火灾编号
        Pointlng: '',//经度
        PointLat: '',//纬度
        loading:'',
        FirePageInfo:[],//存储火灾信息
        arrNotifyInfo:[],//存储根据火灾编号，获取通知的微站信息
        createTime:'',//火灾创建时间,
        FireFighters:'', //指挥员、通讯员、驾驶员、普通队员的信息
        pumper:[

        ],//消防车
        // 更新指挥员或通讯员出动信息1，指挥员，2，通讯员
        InsertOrUpdateCommanderDutyInfoFireList_1:[],
        InsertOrUpdateCommanderDutyInfoFireList_2:[],
        // 更新车辆传值
        Newpumper:[],
        test:[],
        newdata:[],
        D_index:'', //外层坐标
        X_index:'', //内层坐标
        UpdateFlag:1,
        UpdateMsg:'',
    },
    mounted() {
        var Vue = this
        setInterval(function () {
            var time = new Date();
            var y = time.getFullYear();
            var m = time.getMonth() + 1;
            var d = time.getDate();
            var h = time.getHours();
            var mm = time.getMinutes();
            var s = time.getSeconds();
            Vue.time = y + '年' + Vue.add0(m) + '月' + Vue.add0(d) + '日  ' + Vue.add0(h) + ':' + Vue.add0(mm) + ':' + Vue.add0(s);

            var time2 = new Date(Vue.Vehicle_time.replace(/\-/g, "/"));
            var leftTime = time - time2; //计算剩余的毫秒数
            var ld = parseInt(leftTime / 1000 / 60 / 60 / 24, 10); //计算剩余的天数
            var lh = parseInt(leftTime / 1000 / 60 / 60 % 24, 10); //计算剩余的小时
            var lm = parseInt(leftTime / 1000 / 60 % 60, 10);//计算剩余的分钟
            var ls = parseInt(leftTime / 1000 % 60, 10);//计算剩余的秒数

            Vue.time2 = (ld * 24 + lh) + '小时' + lm + '分' + ls + "秒";

        }, 1000)

        this.map = new AMap.Map('gd-map', {
            resizeEnable: true, //是否监控地图容器尺寸变化
            zoom: 13, //初始化地图层级
            center: [118.301306, 35.190822] //初始化地图中心点
        });

        $('body').on('click', '.fire-set-adm-add', function (e) {
            debugger
            Vue.FireFighters=[];
            //this.ajaxGetFireFighters();
            var dataId=$(this).siblings("label").attr("dataId");
            $.ajax({
                type: 'post',
                url: Url+'FireManApi/GetFireManListByType',
                data: JSON.stringify({ FireBrigadeNumber:_FireManInfoModel.Fire_brigade_num,FireManType:dataId }),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    if (msg.state == 1) {
                        console.log(this)
                        //根据选中过的过滤
                        var ary = msg.data;
                        Vue.newdata= msg.data;
                        var delid = Vue.arrOut;
                        arr = ary.filter(item=>{
                            let aaa = delid.map(v=>v.Name)
                            return !aaa.includes(item.Name)
                        })
                        Vue.FireFighters = arr
                        /*newarray =  ary.filter(function(obj){
                            console.log();
                            return delid != obj.Name;
                        });
                        Vue.FireFighters = newarray*/

                    }else {

                    }

                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                }
            });

            e.stopPropagation();
            $('.fire-set-adm-add').data('active', false);
            $(this).data('active', true)
            var left = $(this).offset().left + $(this).outerWidth() + 12
            var top = $(this).offset().top - $('.dialog-selec').outerHeight() / 2 + $(this).outerHeight() / 2
            $('.dialog-selec').css({
                'top': top + 'px',
                'left': left + 'px'
            }).show()
        })
        $('body').on('click', function (e) {
            // debugger
            e.stopPropagation();
            $('.dialog-selec').hide()
            $('.fire-set-adm-name').removeClass('border')
        })
        $('body').on('click', '.fire-set-adm-name', function (e) {
            debugger
            e.stopPropagation();
            $('.fire-set-adm-name').removeClass('border')
            $(this).addClass('border')
        })
        $('body').on('click', '.fire-set-adm-name .close', function (e) {
            debugger
            e.stopPropagation();
            var c =e.target.parentNode.innerText.replace(/\s+/g,"");
            var d = {Name:c};
            // var ary=Vue.arrOut;
            for (var i = Vue.arrOut.length-1; i>=0; i--){
                if (Vue.arrOut[i].Name==c){
                    Vue.arrOut.splice(i,1);
                }
            }
            var dataId=$(this).parent('.fire-set-adm-name').siblings("label").attr("dataId");
            if(dataId=='1')
            {
                var arrNum=$(this).parent('.fire-set-adm-name').attr("arrNum");
                var arr = Vue.InsertOrUpdateCommanderDutyInfoFireList_1;
                arr.splice(arrNum,1);
                Vue.CommanderDutyInfoSpanShow(arr,'fzr');
            }
            else if(dataId=='2')
            {
                var arrNum=$(this).parent('.fire-set-adm-name').attr("arrNum");
                var arr = Vue.InsertOrUpdateCommanderDutyInfoFireList_2;
                arr.splice(arrNum,1);
                Vue.CommanderDutyInfoSpanShow(arr,'txy');
            }
            else if(dataId=='3')
            {
                var Obj=$(this).parent('.fire-set-adm-name');
                var arrNum=Obj.siblings("label").attr("arrNum");
                Vue.pumper[arrNum]["Driver_number"]='';
                Vue.pumper[arrNum]["Driver_name"]='';

                Obj.attr('class', 'fire-set-adm-add').html('+')
            }
            else if(dataId=='4')
            {
                var Obj=$(this).parent('.fire-set-adm-name');
                var arrNum=Obj.siblings("label").attr("arrNum");
                var attNumber=Obj.siblings("label").attr("attNumber");
                Vue.pumper[arrNum]["Solider_number_"+attNumber]="";
                Vue.pumper[arrNum]["Solider_name_"+attNumber]="";
                Vue.pumper[arrNum]["Solider_type_"+attNumber]="";
                Obj.attr('class', 'fire-set-adm-add').html('+')
            }

        })
        $('.dialog-selec').on('click', 'li', function (e) {
            debugger
            var _this = this
            Vue.arrOut.push({
                Name:_this.innerText
            })
            console.log(Vue.arrOut)
            $('.fire-set-adm-add').each(function (index, val) {
                debugger
                if ($(val).data('active')) {
                    var dataId=$(val).siblings("label").attr("dataId");

                    if(dataId=='3')
                    {
                        var arrNum=$(val).siblings("label").attr("arrNum");
                        Vue.pumper[arrNum]["Driver_name"]=$(_this).attr("dataName");
                        Vue.pumper[arrNum]["Driver_number"]=$(_this).attr("dataNumber");
                    }
                    else if(dataId=='4')
                    {
                        var arrNum=$(val).siblings("label").attr("arrNum");
                        var attNumber=$(val).siblings("label").attr("attNumber");
                        Vue.pumper[arrNum]["Solider_number_"+attNumber]=$(_this).attr("dataName");
                        Vue.pumper[arrNum]["Solider_name_"+attNumber]=$(_this).attr("dataNumber");
                        Vue.pumper[arrNum]["Solider_type_"+attNumber]=attNumber;
                    }
                    else if(dataId=='2' || dataId=='1')
                    {
                        // var attNameValue=$(val).siblings("label").attr("attNameValue");
                        var jsonObj={
                            Commander_num:$(_this).attr("dataNumber"),
                            Commander_name:$(_this).attr("dataName"),
                            Commander_type:1,
                            Fire_brigade:Vue.Fire_brigade_number,
                            Fire_brigade_name:Vue.Fire_brigade_name,
                            Fire_number:Vue.FireNumer,
                            Ifused:true
                        }
                        if(dataId=='1')
                        {
                            jsonObj.Commander_type=1
                            var arr=Vue.InsertOrUpdateCommanderDutyInfoFireList_1;
                            arr.push(jsonObj)
                            Vue.CommanderDutyInfoSpanShow(arr,'fzr');
                        }
                        if(dataId=='2')
                        {
                            jsonObj.Commander_type=2
                            var arr=Vue.InsertOrUpdateCommanderDutyInfoFireList_2;
                            arr.push(jsonObj)
                            Vue.CommanderDutyInfoSpanShow(arr,'txy');
                        }
                    }
                    $(val).attr('class', 'fire-set-adm-name')
                    $(val).html($(_this).text() + '<img src="../images/close.png" class="close"/>')
                }
                //获取id中缩带下标
                $('.dialog-selec').hide()
            })
            e.stopPropagation();
        })
        if (this.getRequest().FireNumer) {
            this.FireNumer = this.getRequest().FireNumer
        } else {

        }
        if (this.getRequest().Pointlng) {
            this.Pointlng = this.getRequest().Pointlng
        }
        if (this.getRequest().PointLat) {
            this.PointLat = this.getRequest().PointLat
        }
        this.ajaxFirePageInfo
        this.ajaxGetNotifyInfo()
        this.ajaxGetPumper()
        this.GetCommanderDutyInfoFireZH()
        this.GetCommanderDutyInfoFireTX()
        setInterval(function () {
            Vue.ajaxGetNotifyInfo()
            console.log('1')
        },300000)
        //this.ajaxInfoCar()
    },
    computed:{
        //绑定动态id


        //根据火灾编号获取火灾信息
        ajaxFirePageInfo(){
            var Vue = this;
            var id = Vue.getQueryString('FireNumer');
            Vue.hzbh = id
            var time = Vue.getQueryString('time');
            //Vue.openLoading()
            $.ajax({
                type: 'post',
                url: Url+'FireInfoApi/QueryAllFirePageInfoByFireNumber',
                data: JSON.stringify({ FireNumber: id }),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    if (msg.state == 1) {
                        console.log('根据火灾编号获取火灾信息')
                        Vue.form=msg.data
                        Vue.Vehicle_time=msg.data.Vehicle_time.replace('T', " ")
                        Vue.Pointlng=msg.data.Gaode_coordinate.split(',')[0]
                        Vue.PointLat=msg.data.Gaode_coordinate.split(',')[1]
                        Vue.addFireMarker(Vue.Pointlng,Vue.PointLat)
                        Vue.Fire_brigade_number=msg.data.Charge_number
                        Vue.Fire_brigade_name=msg.data.Charge_brigade
                        if(msg.data.If_finished==true)
                        {
                            $('.aside-set').hide();
                        }
                    }else {
                    }
                    // Vue.ajaxInfoCar()
                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });
        },
    },
    methods:{

        gernerateId: function (index,idx){
            if(idx==undefined){
                return "p_" +index
            }else {
                return "p_" +index+'_'+idx
            }
        },
        updataAll(){
            Vue.UpdateFlag=0;
            Vue.UpdateMsg="";
            //更新指挥员或通讯员出动信息
            this.ajaxReplacePumper()
            // 更新消防车出动信息
            this.ajaxInfoCar()
            //更新火灾
            this.ajaxPageShow()
        },
        getQueryString(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if(r != null) return decodeURI(r[2]);
            return null;
        },
        //根据火灾编号，获取通知的微站信息
        ajaxGetNotifyInfo(){
            var Vue = this;
            $.ajax({
                type: 'post',
                url: Url+'FireNotifyApi/GetNotifyInfoByFireNumber',
                data: JSON.stringify({Pointlng:Vue.Pointlng,PointLat:Vue.PointLat,CoordinateType:'gaode',FireNumber: Vue.FireNumer }),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    if (msg.state == 1) {
                        console.log('获取通知的微站信息')
                        console.log('12')
                        Vue.arrNotifyInfo = msg.data
                        for (var i = 0;i < msg.data.length;i++) {
                            var x =  msg.data[i].Gaode_coordinate.split(',')[0]
                            var y =  msg.data[i].Gaode_coordinate.split(',')[1]
                            Vue.addAroundMarker(x,y,i)
                        }
                    }else {
                        // console.log(err)
                    }
                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });
        },

        ajaxPageShow(){
            var Vue = this
            $.ajax({
                type: 'post',
                url: Url+'FireInfoApi/UpdateFireInfoFromPageShow',
                data: JSON.stringify(Vue.form),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    debugger
                    console.log(msg)
                    if (msg.state == 1) {
                        if(Vue.UpdateFlag==1) {
                            Vue.UpdateMsg += "  火灾信息更新成功,";
                            Vue.$message.success(Vue.UpdateMsg);
                        }
                    }else {
                        Vue.UpdateFlag=0;
                        Vue.$message.error("火灾信息更新失败");
                    }

                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });

        },
        //获取指挥员及通讯员排班信息
        GetCommanderDutyInfoFireZH(){
            var Vue = this;
            var id = Vue.getQueryString('FireNumer');
            $.ajax({
                type: 'post',
                url: Url+'DutyInfoFireApi/GetCommanderDutyInfoFireList',
                data: JSON.stringify({
                    FireNumber: id,
                    CommanderType:'1'
                }),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    debugger
                    var arr = Vue.InsertOrUpdateCommanderDutyInfoFireList_1;
                    arr.splice(0,arr.length);
                    // Vue.InsertOrUpdateCommanderDutyInfoFireList_1.push(msg.data);
                    Vue.InsertOrUpdateCommanderDutyInfoFireList_1=msg.data;
                    if (msg.state == 1) {
                        // msg.data=[];
                        Vue.CommanderDutyInfoSpanShow(msg.data,'fzr');
                    }else {

                    }

                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    Vue.closeLoading()
                    console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });
        },
        GetCommanderDutyInfoFireTX(){
            var Vue = this;
            console.log(Vue.form.Charge_number)
            console.log('获取车辆排班信息')
            // Vue.openLoading()
            $.ajax({
                type: 'post',
                url: Url+'DutyInfoFireApi/GetCommanderDutyInfoFireList',
                data: JSON.stringify({
                    FireNumber: Vue.FireNumer,
                    CommanderType:2}),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    debugger
                    var arr = Vue.InsertOrUpdateCommanderDutyInfoFireList_2;
                    arr.splice(0,arr.length);
                    // Vue.InsertOrUpdateCommanderDutyInfoFireList_2.push(msg.data);
                    Vue.InsertOrUpdateCommanderDutyInfoFireList_2=msg.data;
                    if (msg.state == 1) {
                        //msg.data=[];
                        Vue.CommanderDutyInfoSpanShow(msg.data,'txy');
                    }else {

                    }

                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    Vue.closeLoading()
                    console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });
        },
        CommanderDutyInfoSpanShow(InfoList,type) {
            var obj;
            if (type == 'fzr') {
                obj = $("span[apanType='fzr']");
            }
            if (type == 'txy') {
                obj = $("span[apanType='txy']");
            }
            obj.each(function (index, val) {
                if (InfoList.length == 0) {
                    if (index == 1) {
                        $(val).hide();
                    }
                    $(val).attr('class', 'fire-set-adm-add').html('+');
                } else {

                    if (InfoList.length == 1) {
                        if (index == 0) {
                            $(val).attr('class', 'fire-set-adm-name')
                            var c = InfoList[index].Commander_name
                            var d = InfoList[index].Commander_num
                            $(val).html(c + '<img src="../images/close.png" class="close"/>')
                            $(val).attr("attNumberValue", d);
                        }
                        if (index == 1) {
                            $(val).show();
                            $(val).attr('class', 'fire-set-adm-add').html('+');
                        }
                    } else {
                        if (InfoList[index] != undefined) {
                            $(val).attr('class', 'fire-set-adm-name')
                            var c = InfoList[index].Commander_name
                            var d = InfoList[index].Commander_num
                            $(val).html(c + '<img src="../images/close.png" class="close"/>')
                            $(val).attr("attNumberValue", d);
                        }
                        if (index == 1) {
                            $(val).show();
                        }
                    }
                }
                /*                if(InfoList[index]!=undefined){
                                    $(val).attr('class', 'fire-set-adm-name')
                                    var c =InfoList[index].Commander_name
                                    var d =InfoList[index].Commander_num
                                    $(val).html( c + '<img src="../images/close.png" class="close"/>')
                                    $(val).attr("attNumberValue",d);
                                }*/
            })
        },
        //获取车辆排班信息
        ajaxGetPumper(){
            var Vue = this;
            console.log(Vue.form.Charge_number)
            console.log('获取车辆排班信息')
            // Vue.openLoading()
            $.ajax({
                type: 'post',
                url: Url+'DutyInfoFireApi/GetDutyInfoFireList',
                data: JSON.stringify({FireNumber: Vue.FireNumer,
                    BrigadeNumber:_FireManInfoModel.Fire_brigade_num}),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    Vue.closeLoading()
                    if (msg.state == 1) {
                        Vue.pumper = msg.data
                        Vue.Newpumper = msg.data
                        var pumper  =msg.data;

                        var x = ''
                        for(var i =0;i<pumper.length; i++){
                            Vue.pumper[i].zwVal =[]
                            for( x in pumper[i]) {
                                var d = x.substring(0,13)
                                if(d=='Solider_name_'&&d!=undefined){
                                    Vue.pumper[i].zwVal.push(pumper[i][x])
                                    //Vue.Newpumper.push(pumper[i])
                                }
                            }
                        }
                        console.log(Vue.pumper )
                    }else {

                    }

                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    Vue.closeLoading()
                    console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });
        },
        ajaxReplacePumper(){
            var Vue = this;
            console.log(_FireManInfoModel)
            debugger
            var x =  Vue.InsertOrUpdateCommanderDutyInfoFireList_1.concat(Vue.InsertOrUpdateCommanderDutyInfoFireList_2)
            var m={ Fire_number:Vue.FireNumer,List:x}
            //console.log(_UserRoleRelationModel)
            // Vue.openLoading()
            $.ajax({
                type: 'post',
                url: Url+'DutyInfoFireApi/InsertOrUpdateCommanderDutyInfoFireList',
                data: JSON.stringify(m),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    debugger
                    if (msg.state == 1) {
                        if(Vue.UpdateFlag==1) {
                            Vue.UpdateMsg += "  指挥员、通讯员信息更新成功,";
                            Vue.$message.success(Vue.UpdateMsg);
                        }
                    }else {
                        Vue.UpdateFlag=0;
                        Vue.$message.error("指挥员、通讯员信息更新失败");
                    }

                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    //console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });
        },

        ajaxInfoCar(){
            var Vue = this
            var m={ Fire_number:Vue.FireNumer,List:Vue.pumper}

            $.ajax({
                type: 'post',
                url: Url+'DutyInfoFireApi/InsertOrUpdateDutyInfoFireList',
                data: JSON.stringify(m),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    debugger
                    if (msg.state == 1) {
                        // Vue.$message.success('车辆信息更新成功')
                        if(Vue.UpdateFlag==1) {
                            Vue.UpdateMsg += "  车辆信息更新成功,";
                            Vue.$message.success(Vue.UpdateMsg);
                        }
                    }else {
                        Vue.UpdateFlag=0;
                        Vue.$message.error("车辆信息更新失败");
                    }
                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                    console.log(XMLHttpRequest, textStatus, errorThrown)
                }
            });
        },
        //获取URL的参数
        getRequest() {
            var url = location.search; //获取url中"?"符后的字串
            var theRequest = new Object();
            if (url.indexOf("?") != -1) {
                var str = url.substr(1);
                strs = str.split("&");
                for(var i = 0; i < strs.length; i ++) {
                    theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
                }
            }
            return theRequest;
        },
        //创建周围坐标点
        addAroundMarker(x,y,i) {
            var markerContent = '' +
                '<div class="custom-content-marker">' +
                '   <img src="../images/point_blue.png">' +
                '   <div class="close-btn" onclick="clearMarker()">'+(i+1)+'</div>' +
                '</div>';

            this.marker2 = new AMap.Marker({
                position: [x,y],
                content: markerContent,
                offset: new AMap.Pixel(-13, -30)
            });
            this.marker2.setMap(this.map);
        },
        addFireMarker(x,y) {
            var markerContent = '' +
                '<div class="custom-content-marker">' +
                '   <img src="../images/point_red.png">' +
                '   <div class="close-btn" >火</div>' +
                '</div>';

            this.marker1 = new AMap.Marker({
                position: [x,y],
                content: markerContent,
                offset: new AMap.Pixel(-13, -30)
            });
            this.marker1.setMap(this.map);
        },
        verifyNum(e){
            e.currentTarget.value = e.currentTarget.value.replace(/\D/g,'')
            if(e.currentTarget.value> 200000){
                e.currentTarget.value = 200000
            }
        },
        openLoading() {
            this.loading = this.$loading({
                lock: true,
                text: 'Loading',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
        },
        //火灾结束
        ajaxFireEnd(){
            this.flag = '1';
        },
        yes(){
            var Vue =this
            $.ajax({
                type: 'post',
                url: Url+'FireInfoApi/UpdateFireInfoFinished',
                data: JSON.stringify({FireNumber: Vue.FireNumer}),
                dataType:'json',
                contentType: 'application/json',
                success: function (msg) {
                    if (msg.state == 1) {
                        Vue.off();
                        Vue.$message.success("结束火灾操作成功");
                    }else {
                        Vue.$message.error('结束火灾操作失败')
                    }
                }
            });
        },
        off(){
            this.flag = '';
        },
        closeLoading(){
            //console.log('no')
            //this.loading.close();
        },
        add0(m){
            return m<10?'0'+m:m
        },
        Quit(){
            $.cookie('token', '',{ expires: -1 ,path: '/' });
            window.location.href='../login.html'
        }
    }

})
